import React, {Component} from 'react';
// import PropTypes from "prop-types";
import PubSub from "pubsub-js";

class Search extends Component {
    state = {
        inputVal: ""
    };
    inputChange = (e) => {
        const inputVal = e.target.value.trim();
        console.log(inputVal);
        this.setState({
            inputVal
        })
    };
    search = () => {
        const {inputVal} = this.state;
        PubSub.publish("search",inputVal);
        this.setState({
            inputVal: ""
        })
    };

    render() {
        const {inputVal} = this.state;
        const flag = inputVal ? false : true;
        return (
            <section className="jumbotron">
                <h3 className="jumbotron-heading">Search Github Users</h3>
                <div>
                    <input type="text" placeholder="enter the name you search" value={inputVal}
                           onChange={this.inputChange}/>&nbsp;
                    <button disabled={flag} onClick={this.search}>Search</button>
                </div>
            </section>
        );
    }
}

export default Search;